이 모듈은 캔버스의 상태를 조작함으로써 정적인 경로에서 동적인 이벤트 기반 도구로 전환합니다. CanvasRenderingContext2D 상태를 활용하여 애플리케이션의 기능을 확장하는 데 집중합니다. 고차원 패턴 수학적 필터링을 통해 가능하게 됩니다.

1. 고차원 도구 패턴

예를 들어 tools.Line 와 같은 보조 함수를 사용해 마우스 이벤트를 추상화합니다. trackDrag반면, tools.Spray 는 간격 기반 반복 를 통해 setInterval마우스를 누르고 있을 때 지속적으로 픽셀을 배치할 수 있게 해줍니다.

2. 수학적 제약 조건

간단한 무작위 오프셋은 사각형 분포를 생성합니다. 자연스러운 원형 '브러시' 효과를 얻으려면 피타고라스 정리를 이용해 점을 필터링합니다: $x^2 + y^2 < r^2$. 또는 극좌표계를 사용하여 Math.sin 그리고 Math.cos 변환할 수도 있습니다.

3. 복합 연산 및 상태

표준 선 그리기 외에도 globalCompositeOperation 속성은 새로운 픽셀이 기존 픽셀과 어떻게 상호작용하는지를 정의합니다. 예를 들어, 이를 'destination-out' 로 설정하면 tools.Erase 함수가 픽셀을 흰색으로 칠하는 대신 투명하게 만들 수 있게 합니다. 사용자 인터페이스 컨트롤인 controls.color 그리고 controls.brushSize 은 fillStyle 그리고 lineWidth 각각 실시간으로 업데이트합니다.